<template>
    <div class="set-page firstTab">
        <div style="color:white;text-align: end;margin:15px 30px 0 0">NTP时间： {{ nowTime }} 
            <i class="el-icon-timer" style="cursor:pointer" @click="getTimer()"></i>
        </div>
        <div style="float:left;margin:10px 30px 0 50px">
            <div style="width:600px;height:530px;float: left;margin-bottom: 40px;">
                <el-form style="margin-left: 20px;">
                    <div style="color:#89eaff;margin:50px 0 20px 0">通道工作状态：</div>
                    <div style="color:#ccc;margin-bottom: 10px;">
                        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange" style="margin-left:45px" class="firstCheck">全选</el-checkbox>
                        <div class="table-title" style="margin-left:47px">解调模式</div>
                        <div class="table-title" style="margin-left:57px">数据长度(kb)</div>
                        <div class="table-title" style="margin-left:38px">通道开关</div>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[0]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[0]" @change="handleCheckedCitiesChange">通道1：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[0]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[0]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[0]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(0)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[1]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[1]" @change="handleCheckedCitiesChange">通道2：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[1]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;" class="inline-div">
                            <el-input v-model="lengths[1]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;" class="inline-div">
                            <el-switch
                                v-model="swValue[1]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(1)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[2]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[2]" @change="handleCheckedCitiesChange">通道3：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[2]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[2]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[2]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(2)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[3]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[3]" @change="handleCheckedCitiesChange">通道4：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[3]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[3]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[3]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(3)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[4]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[4]" @change="handleCheckedCitiesChange">通道5：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[4]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[4]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[4]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(4)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[5]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[5]" @change="handleCheckedCitiesChange">通道6：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[5]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[5]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[5]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(5)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[6]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[6]" @change="handleCheckedCitiesChange">通道7：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[6]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[6]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[6]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(6)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[7]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[7]" @change="handleCheckedCitiesChange">通道8：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[7]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[7]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[7]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(7)">
                            </el-switch>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div style="width:600px;height:530px;float: left;margin-bottom: 40px;">
                <el-form style="margin-left: 30px;">
                    <div style="color:#fff;text-align: right;margin-right:100px;line-height: 35px;margin-bottom: 18px;margin-top: 40px;">
                        <div style="display: inline-block;margin-top:-10px;vertical-align:text-top;">通道开：</div><div style="display:inline-block;font-size:35px;margin-right: 20px;line-height: 28px;vertical-align: text-bottom;" class="greenLight">●</div>
                        <div style="display: inline-block;margin-top:-10px;vertical-align:text-top;">通道关：</div><div style="display:inline-block;font-size:35px;margin-right: 20px;line-height: 28px;vertical-align: text-bottom;" class="redLight">●</div>
                    </div>
                    <div style="color:#ccc;margin-bottom: 10px;">
                        <div class="table-title" style="margin-left:150px">解调模式</div>
                        <div class="table-title" style="margin-left:55px">数据长度(kb)</div>
                        <div class="table-title" style="margin-left:38px">通道开关</div>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[8]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[8]" @change="handleCheckedCitiesChange">通道9：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:13px;width: 110px;" class="inline-div">
                            <el-input v-model="models[8]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[8]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[8]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(8)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[9]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[9]" @change="handleCheckedCitiesChange">通道10：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[9]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[9]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[9]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(9)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[10]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[10]" @change="handleCheckedCitiesChange">通道11：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[10]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[10]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[10]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(10)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[11]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[11]" @change="handleCheckedCitiesChange">通道12：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[11]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[11]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[11]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(11)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[12]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[12]" @change="handleCheckedCitiesChange">通道13：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[12]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[12]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[12]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(12)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[13]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[13]" @change="handleCheckedCitiesChange">通道14：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[13]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[13]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[13]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(13)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[14]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[14]" @change="handleCheckedCitiesChange">通道15：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[14]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[14]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[14]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(14)">
                            </el-switch>
                        </el-form-item>
                    </div>
                    <div style="width:100%;overflow: hidden;height:50px">
                        
                        <el-form-item style="margin-top: -2px;margin-left:10px;width: 20px;" class="inline-div">
                            <span style="font-size:35px;" :class="stateLight[15]">●</span>
                        </el-form-item>
                        <el-form-item style="margin-left:15px;" class="inline-div">
                            <el-checkbox v-model="checks[15]" @change="handleCheckedCitiesChange">通道16：</el-checkbox>
                        </el-form-item>
                        <el-form-item style="margin-left:5px;width: 110px;" class="inline-div">
                            <el-input v-model="models[15]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;width: 110px;"  class="inline-div">
                            <el-input v-model="lengths[15]" size="small" placeholder="请输入" style="width:100px;margin: 0 5px;" readonly></el-input>
                        </el-form-item>
                        <el-form-item style="margin-left:20px;"  class="inline-div">
                            <el-switch
                                v-model="swValue[15]"
                                active-text="开"
                                inactive-text="关"
                                @change="channelSwitch(15)">
                            </el-switch>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div style="width:1200px">
                <div style="color:#ddd;margin-left:50px;display:inline">
                    储存路径：
                    <el-input size="small" v-model="savePath" class="input-with-select" style="width:200px;margin:0 5px" @change="changeSavepath()">
                    </el-input>
                </div>
                <div style="color:#ddd;margin-left:50px;display:inline">
                    文件大小：
                    <el-input v-model="fileSize" size="small" style="width:120px;margin:0 5px" @change="changeFilesize()"></el-input>MB (&lt;3000MB)
                </div>
                <div style="margin-left:50px;display:inline">
                    <button type="button" class="et-button" style="width:90px" @click="startCollectBtn()">开始采集</button>
                </div>
                <div style="margin-left:50px;display:inline">
                    <button type="button" class="et-button" style="width:90px" @click="clearCountBtn()">清空计数</button>
                </div>
            </div>
        </div>
        <div style="width:400px;float:left;height: 320px;border: 1px solid #89eaff;margin: 100px 50px 0 50px;border-radius: 5px;">
            <div style="color:#ccc;margin: 15px 0 10px 15px;">服务器IP配置</div>
            <div class="dividerLine"></div>
            <div class="rectPoint"></div>
            <el-form>
                <div>
                    <el-form-item class="inline-div" style="margin-left:20px;height: 50px;width: 300px;" label="服务器IP:" label-width="88px">
                        <el-input v-model="serverState.ip" size="small" style="width: 180px;"></el-input>
                    </el-form-item>
                    <el-form-item class="inline-div" style="margin-left:20px;height: 50px;width: 300px;" label="子网掩码:" label-width="88px">
                        <el-input v-model="serverState.subnet" size="small" style="width: 180px;"></el-input>
                    </el-form-item>
                    <el-form-item class="inline-div" style="margin-left:20px;height: 50px;width: 300px;" label="默认网关:" label-width="88px">
                        <el-input v-model="serverState.net" size="small" style="width: 180px;"></el-input>
                    </el-form-item>
                    <!-- <el-form-item class="inline-div" style="margin-left:20px;height: 50px;width: 300px;" label="串口选择:" label-width="88px">
                        <el-select v-model="comValue" size="small" style="width: 150px;">
                            <el-option
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                </div>
            </el-form>
            <div style="color:#fff;width:500px;float:left;margin-top:15px">
                <button type="button" class="et-button" style="width:90px;margin-left:150px" @click="configIp()">配置IP</button>
            </div>
            <div style="color:#999;width:350px;float:left;margin-top:20px;margin-left: 10px;font-size: 13px;">
                * 若要修改IP及其它,请直接在输入框修改,并点击配置IP按钮
            </div>
        </div>
        <div></div>
    </div>
</template>

<script>
import { clSwitch, enterFirstPage, ipGet, ipSet, startCollect, clearCount, saveSwitch } from '../../../api/tansfer';
export default {
    data() {
      return {
        models:["AM","","","","","","","","","","","","","","",""],   //数据模式
        lengths:["200","","","","","","","","","","","","","","",""],    //数据长度
        values:["","","","","","","","","","","","","","","",""],    
        checkAll: false,
        isIndeterminate: true,
        checks: [true, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false],
        stateLight:["greenLight", "redLight", "greenLight", "redLight","greenLight", "redLight","greenLight", "redLight","greenLight", "redLight","greenLight", "redLight","greenLight", "redLight","greenLight", "redLight",],
        comValue:'',
        savePath: '',
        swValue:[true, false, true, false, true, false, true, false, true, false, true, false, true, false, true, false, ],
        nowTime:'',
        fileSize:'',
        equipmentState:{
            ip: '192.168.1.11',
            ipPort: '',
            falseFrame: '',
            frameLess: '',
            netState: '',
        },
        serverState:{
            ip: '',
            subnet: '',
            net: '',
        },
        usedSave:'0',
        totalSave:'1000',
        webSocket:'',
      };
    },
    mounted() {
        // this.nowTimes()
        enterFirstPage().then((res) => {
            const data = res.data.data
            //console.log(data)
            this.savePath = data[0].path
            for (let i = 0; i < 16; i++){
                switch (data[i].jietiaoType) {
                    case 1:
                        this.models[i] = 'AM'
                        break;
                    case 2:
                        this.models[i] = 'FM'
                        break;
                    case 3:
                        this.models[i] = '2FSK'
                        break;
                    case 4:
                        this.models[i] = '4FSK'
                        break;
                    default:
                        break;
                }
                this.swValue[i] = data[i].open == 1 ? true : false
                this.stateLight[i] = data[i].open == 1 ? "greenLight" : "redLight"
            }
        })
        ipGet().then((res) => {
            const data = res.data.data
            console.log(data)
            this.savePath = data.storePath
            this.serverState.ip = data.ip
            this.serverState.subnet = data.ipMask
            this.serverState.net = data.gateway
        })
        this.initWebSocket()
    },
    destroyed () {
        this.webSocket.close()
    },
    methods: {
        handleCheckAllChange(val) {
            if(val){
                for (let i = 0; i < 16; i++){
                    this.checks[i] = true
                }
            } else {
                for (let i = 0; i < 16; i++){
                    this.checks[i] = false
                }
            }
            this.isIndeterminate = false;
        },
        handleCheckedCitiesChange() {
            console.log("山重水复疑无路，柳暗花明又一村")
            let count = 0
            for(let i = 0;i < 16;i++){
                this.checks[i] ? count++ : '';
            }
            this.checkAll = count === 16;
            this.isIndeterminate = count > 0 && count < 16;
        },
        
        getTimer() {
            this.$confirm('将校准时间, 是否继续?','校准时间', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
            }).then(() => {
                this.$message({
                    type: 'success',
                    message: '获取成功!'
                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消'
                });          
            });
        },
         //显示当前时间（年月日时分秒）
        //  timeFormate(timeStamp) {
        //     let year = new Date(timeStamp).getFullYear();
        //     let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1;
        //     let date =new Date(timeStamp).getDate() < 10? "0" + new Date(timeStamp).getDate(): new Date(timeStamp).getDate();
        //     let hh =new Date(timeStamp).getHours() < 10? "0" + new Date(timeStamp).getHours(): new Date(timeStamp).getHours();
        //     let mm =new Date(timeStamp).getMinutes() < 10? "0" + new Date(timeStamp).getMinutes(): new Date(timeStamp).getMinutes();
        //     let ss =new Date(timeStamp).getSeconds() < 10? "0" + new Date(timeStamp).getSeconds(): new Date(timeStamp).getSeconds();
        //     this.nowTime = year + "年" + month + "月" + date + "日" + " " + hh + ":" + mm + ':' + ss;
        // },
        // nowTimes(){
        //     this.timeFormate(new Date());
        //     setInterval(this.nowTimes,1000);
        //     this.clear()
        // },
        // clear(){
        //     clearInterval(this.nowTimes)
        //     this.nowTimes = null;
        // },

        //配置ip
        configIp() {
            const param = {
                ip: this.serverState.ip,
                ipMask: this.serverState.subnet,
                gateway: this.serverState.net,
            }
            ipSet(param).then(() => {
                this.$message({
                    type: 'success',
                    message: '配置成功!'
                });
            }).catch(() => {
                this.$message({
                    type: 'error',
                    message: '配置失败'
                });
            });
        },
        //16通道开关
        channelSwitch(n) {
            let flag = this.swValue[n] ? 1 : 0
            const param = {
                'channelNum': n + 1,
                'open': flag
            }
            console.log(param)
            clSwitch(param)
        },
        //修改路径
        changeSavepath() {
            if (this.savePath == '') {
                this.$message.error('存储路径不能为空！')
            } else {
                const param = {
                    storePath: this.savePath,
                    store: '',
                    singleFileSize: '',
                }
                saveSwitch(param)
            }
        },
        //修改存储大小
        changeFilesize() {
            const param = {
                storePath: '',
                store: '',
                singleFileSize: this.fileSize,
            }
            saveSwitch(param)
        },

        //开始采集
        startCollectBtn() {
            const param = {
                collect: true
            }
            startCollect(param).then(() => {
                this.$message({
                    type: 'success',
                    message: '开始采集!'
                });
            })
        },

        //清空计数
        clearCountBtn() {
            clearCount().then(() => {
                // 清空
            })
        },

        initWebSocket () {
            const wsuri = 'ws://192.168.1.67:8002/antenna/toec/yk/ws/1_12345678'
            this.webSocket = new WebSocket(wsuri)
            this.webSocket.onmessage = this.webSocketOnMessage
            this.webSocket.onopen = this.webSocketOnOpen
            this.webSocket.onerror = this.webSocketOnError
            this.webSocket.onclose = this.webSocketClose
        },
        webSocketOnOpen () {
            console.log('websocket已打开')
        },
        webSocketOnError () {
            console.log('websocket发生了错误')
        },
        webSocketOnMessage(e) {
            const data = JSON.parse(e.data)
            console.log(data)
            if (data.list != undefined) {
                this.nowTime = data.list[0]
            }
            if (data.channelFileSizeMaps != undefined) {
                for (let i = 0; i < 16; i++){
                    this.lengths[i] = data.channelFileSizeMaps[i]
                }
            }
        },
        webSocketClose (e) {
            console.log('断开连接', e)
        },
    },
};
</script>
<style lang="scss">
    .firstTab .el-checkbox__label{
        color:#82b7ce !important
    }
    .firstTab .firstCheck .el-checkbox__label{
        color:#ddd !important
    }
    .inlinediv{
        display:inline;
    }
</style>